<script lang="ts" setup>
import { ref } from 'vue'
import router from '@/router';

const value = ref(0)

const value1 = ref('前端框架应用项目开发')
const value2 = ref('a')

const option1 = [
    { text: '前端框架应用项目开发', value: '前端框架应用项目开发' },
    { text: '专业技能综合实践', value: '专业技能综合实践' },
    { text: '后端技术与项目开发', value: '后端技术与项目开发' },
];
const option2 = [
    { text: '刷题', value: 'a' },
    { text: '作品', value: 'b' },


];

const columns = [
  {
    text: 'Vue3开发初体验',
    value: '1',
    children: [
      {
        text: '7.5',
        value: '',
        children: [
          { text: '2024/03/17 23:59:59', value: '' },

        ],
      },
    ],
  },
  {
    text: 'Vue3组件化开发',
    value: '2',
    children: [
      {
        text: '10',
        value: '',
        children: [
          { text: '2024/04/14 23:59:', value: '' },

        ],
      },

    ],
  },
  {
    text: 'Vue前端基础刷题',
    value: '3',
    children: [
      {
        text: '7.5',
        value: '',
        children: [
          { text: '2024/03/31 23:59:59', value: '' },

        ],
      },

    ],
  },
  {
    text: 'Vue3路由的使用',
    value: '4',
    children: [
      {
        text: '7.5',
        value: '',
        children: [
          { text: '2024/05/12 23:59:59', value: '' },

        ],
      },

    ],
  },
  {
    text: '电影列表项目',
    value: '5',
    children: [
      {
        text: '7.5',
        value: '',
        children: [
          { text: '2024/04/07 23:59:', value: '' },

        ],
      },

    ],
  },





];

</script>

<template>

    <div class="container">
        <van-button type="primary" @click="router.push('/home')" style="margin-bottom: 20px;">返回</van-button>

        <div style="display: flex;">
            <van-dropdown-menu style="width: 150px;margin-bottom: 20px;">
                <van-dropdown-item v-model="value1" :options="option1" />
            </van-dropdown-menu>

            <van-dropdown-menu style="width: 150px;margin-bottom: 20px;margin-left: 30px;">
                <van-dropdown-item v-model="value2" :options="option2" />
            </van-dropdown-menu>
        </div>

        <div class="textbox">
            <p>
                <b>课程</b>:<font style="color: aqua;font-size: 23px;">{{ value1 }}</font>
            </p>
            <p style="color: green;font-size: 18px;">测试学生3 33333333 22软件技术3班 </p>
            <p style="color: red;font-size: 18px;">任务分:0分， 加分:10分， 课程分:10分，总评:8分。</p>
        </div>

        <van-picker title="成绩" :columns="columns" />

        <div style="display: flex;">
            <van-stepper v-model="value" style="margin-top: 20px;margin-left: 20px;" />
            <van-cell-group inset style="margin: 10px;">
                <van-field v-model="value" label="前往" />
            </van-cell-group>
        </div>


    </div>

</template>